<template>
	<view class="container">

		<view class="">
			<u-subsection fontSize="14px" :list="list" :current="curNow" @change="sectionChange" bgColor="#3c9cff">
			</u-subsection>
		</view>

		<view>
			<u--form labelPosition="left" :model="device" :rules="rules" ref="uForm">
				<u-form-item label="商户名称" prop="searchName" labelWidth="70px">
					<u--input v-model="device.searchName" border="none" placeholder="请输入酒店关键字" trim
						@blur="inputChange(event)"></u--input>
				</u-form-item>


				<u-form-item prop="merchantId" required labelWidth="70px">
					<view class="uni-px-5 uni-pb-5">
						<uni-data-select v-model="device.merchantId" :localdata="merchantNameList" placeholder="请选择酒店 "
							></uni-data-select>
					</view>
				</u-form-item>
				

				<u-form-item required label="套餐类型" prop="setMealId" labelWidth="70px">
					<view class="uni-px-5 uni-pb-5">
						<uni-data-select v-model="device.setMealId" :localdata="setMealList" @change="inputSelectChange"></uni-data-select>
					</view>
				</u-form-item>

				<u-form-item required label="详情:" prop="setMealInfo" labelWidth="70px">
					<u--textarea v-model="device.setMealInfo"  disabled   border="bottom" ></u--textarea>
				</u-form-item>


				<u-button type="primary" @click="submit">修改</u-button>
			</u--form>
		</view>
	</view>

	</view>
</template>

<script>
	import {
		listBinding,
		getBinding,
		addBinding,
		updateBinding,
		delBinding,
		batchEdit
	} from "@/api/system/device";

	import {
		getList,
	} from "@/api/system/user";

	import {
		listMeal
	} from '@/api/system/setmeal'

	export default {

		data() {
			return {

				list: ['上传设备', '修改类型', '查找设备'],
				curNow: 1,
				merchantNameList: [],
				setMealInfoLists: [],
				setMealList: [],
				device: {
					searchName: '',
					merchantId: '',
					setMealId: '',
					pageNum: 1,
					pageSize: 50,
					setMealInfo: '',
					status:0
				},

				rules: {
					'merchantId': [{
						type: 'any',
						required: true,
						message: '那个场所',
						max: 8,
						trigger: ['blur', 'change']
					}],

					'setMealId': [{
						type: 'any',
						required: true,
						message: 'select',
						max: 8,
						trigger: ['blur', 'change']
					}]
				},
			};
		},
		async onReady() {
			const res = await listMeal(this.device);
			console.log(JSON.stringify(res.rows));
			this.setMealList = [];
			this.setMealInfoLists = [];
			// 遍历返回的每一行数据
			this.setMealInfoLists = res.rows.map(item => {
				const newObj = {};
				// 遍历每个对象的键值对
				for (const [key, value] of Object.entries(item)) {
					newObj[key] = value; // 将键值对添加到 newObj 中
				}
				return newObj; // 返回转换后的对象
			});
			res.rows.forEach((val, index) => {
				this.setMealList.push({
					value: val.id,
					text: val.name
				})
			})
		},
		methods: {

			async inputChange(e) {
				this.device.merchantId = '';
				console.log(3)
				console.log(this.device.searchName)
				if (this.device.searchName == '') {
					this.merchantNameList = [];
					return
				}
				let requstData = {
					merchantName: ''
				}
				requstData.merchantName = this.device.searchName;
				const res = await getList(requstData);
				console.log(JSON.stringify(res.data));
				this.merchantNameList = [];
				res.data.forEach((val, index) => {
					this.merchantNameList.push({
						value: val.userId,
						text: val.merchantName
					})
				})
			},
			inputSelectChange(e) {
				console.log('当前id:' + e);
				const meal = this.setMealInfoLists.find(item => item.id === e);
				this.device.setMealInfo = '前'+meal.startTime + '小时内' + meal.startTotalPay + '元,超出部分 ' + meal.incrementPay +
					'/小时; 消费封顶价' + meal.dayTopPay + '元,预付金额' + meal.totalPay + '元';
			},
			sectionChange(index) {
				if (index == this.curNow) {
					return
				}
				let oldCurNow = this.curNow;
				this.curNow = index;
				if (index === 0) {
					uni.navigateTo({
						url: '/pages/device/device'
					})
				} else if (index === 1) {
					uni.navigateTo({
						url: '/pages/device/deviceUpdate'
					})
				} else if (index === 2) {
					uni.navigateTo({
						url: '/pages/device/deviceSearch'
					})
				}
			},
			submit() {
				console.log('1' + this.device.merchantId)
				if (this.device.merchantId == "") {
					uni.$u.toast('酒店名称必选')
					return
				}

				if (this.device.setMealId == "") {
					uni.$u.toast('套餐必须')
					return
				}

				console.log(JSON.stringify(this.device))
				this.$refs.uForm.validate().then(res => {
					this.$modal.confirm('确认将修改用户全部设备的套餐').then(() => {
						console.log('用户已确认');
						return batchEdit(this.device);
					}).then((res2) => {
						console.log('批量编辑成功');
						return this.$modal.showToast(res2.msg)
					}).catch(e => {
						console.log('修改失败' + JSON.stringify(e))
						this.$modal.msgError('修改失败' + e)
					})
				}).catch(errors => {
					uni.$u.toast('校验失败 : ' + JSON.stringify(errors))
				})
			},

		}
	}
</script>

<style lang="scss" scoped>
	.container {
		//width: 94%;
		padding: 12px;
		display: flex;
		flex-direction: column;
		margin: auto;
		background: linear-gradient(180deg, #f0f0f0 0%, #d0eaff 100%);
		height: 100vh;
	}

</style>